
import React, { useState, useEffect } from 'react'

export default function App() {
  
  const [ count, setCount ] = useState(0)
  
  // 1. [] 
  // 含义：代表挂载时，等同于compinentDivMount，只执行一次
  // 场景：发请求、监听事件、开启定时器
  useEffect(() =>{
    console.log("我被执行了");
  },[])

  // 2. [依赖项] 代表：挂载时和更新时二合一，相当于compinentDivMount 和 compinentDivUpdate二合一
  // 含义：只会监听挂载时和状态改变时，
  // 注意：只会监听依赖项的改变，非依赖项不会触发
  // 场景：缓存
  useEffect(() => {
    console.log("我被执行了");
  }, [count]) // [依赖项] 类似vue中的侦听器，开了immediatel

  // 3. 不传
  // 含义：相当于compinentDivMount 和 compinentDivUpdate二合一
  // 不同：监听全部的依赖项变化
  useEffect(() =>{
    console.log("我被执行了");
  })

  return (
    <div>

      count -- { count }
      <hr />
      <button onClick={()=> setCount(count+1)}>点击改变count</button>
    </div>
  )
}